import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:fsharing/core/models/store_product_query.dart';
import 'package:fsharing/main.dart';
import 'package:fsharing/ui/pages/store/product_page.dart';
import 'package:fsharing/ui/widgets/count_down_badge.dart';

class ProductItem extends StatelessWidget {
  final Product product;

  const ProductItem({
    Key key,
    @required this.product,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    bool showOriginPrice = product.salePrice != '0' && product.salePrice != product.sellingPrice;
    return Theme(
      data: lightTheme(),
      child: Builder(
        builder: (context) => Material(
          child: InkWell(
            child: Container(
              padding: EdgeInsets.all(10),
              height: 156,
              child: Row(
                children: <Widget>[
                  Stack(
                    children: <Widget>[
                      ClipRRect(
                        borderRadius: BorderRadius.circular(4),
                        child: CachedNetworkImage(
                          imageUrl: product.productImage,
                          width: 136,
                          height: 136,
                          fit: BoxFit.fill,
                        ),
                      ),
                      CountDownBadge(
                        startTime: product.startTime,
                        endTime: product.endTime,
                        serverTime: product.serverTime,
                      ),
                    ],
                  ),
                  SizedBox(width: 10),
                  Expanded(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: <Widget>[
                        Container(
                          margin: EdgeInsets.only(top: 5),
                          child: Text(
                            product.productName,
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.all(4),
                          decoration: BoxDecoration(
                            color: Theme.of(context).accentColor,
                            borderRadius: BorderRadius.circular(4),
                          ),
                          child: Text(
                            product.storeAreaNames,
                            style: TextStyle(color: Colors.white, fontSize: 13),
                          ),
                        ),
                        Text(
                          '运费0元',
                          style: TextStyle(color: Colors.black54, fontSize: 12),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Text.rich(
                              TextSpan(
                                text: '￥',
                                style: TextStyle(
                                  color: Theme.of(context).accentColor,
                                  fontSize: 14,
                                ),
                                children: [
                                  TextSpan(
                                    text: product.sellingPrice,
                                    style: TextStyle(fontSize: 19),
                                  ),
                                  if (showOriginPrice)
                                    TextSpan(
                                      text: '￥',
                                      style: TextStyle(
                                        color: Colors.black54,
                                        decoration: TextDecoration.lineThrough,
                                      ),
                                      children: [
                                        TextSpan(text: product.salePrice),
                                      ],
                                    )
                                ],
                              ),
                            ),
                            Image.asset(
                              'assets/images/store/ic_cart.png',
                              width: 18,
                              color: Theme.of(context).accentColor,
                            )
                          ],
                        )
                      ],
                    ),
                  )
                ],
              ),
            ),
            onTap: () => _onItemClicked(context),
          ),
        ),
      ),
    );
  }

  void _onItemClicked(BuildContext context) {
    Navigator.of(context).pushNamed(
      '/product',
      arguments: ProductPageArgs(product.miaId, product.curStoreId),
    );
  }
}
